﻿// Defines an HTML wrapper element that can manipulate attributes, CSS classes, styles and events
define([
    'Wjs/ui/elements/Element',
    'Wjs/ui/elements/mixins/DomAttributes',
    'Wjs/ui/elements/mixins/CssClasses',
    'Wjs/ui/elements/mixins/CssStyles',
    'Wjs/ui/elements/mixins/Showable',
    'Wjs/ui/elements/mixins/DomEvents'
],
function () {
    'use strict';

    var Element = Wjs.getType('Element');

    return Wjs.defineOnce({

        type: 'View',

        internal: {

            base: Element,

            mixins: [
                Wjs.getType('DomAttributes'),
                Wjs.getType('CssClasses'),
                Wjs.getType('CssStyles'),
                Wjs.getType('Showable'),
                Wjs.getType('DomEvents')
            ]
        },

        // Renders this element in the DOM
        render: function (fragment) {

            if (this.isRendered()) { // Already rendered

                return;
            }

            Element.prototype.render.call(this, fragment);

            if (fragment) { // If a document fragment is provided by a container or other mixin

                fragment.appendChild(this.domEl);
            }

            return this;
        },

        // Creates a copy of this element
        clone: function () {
            var cloned = Element.prototype.clone.call(this);

            this.constructor.notifyMixins('onCloned', this, cloned);

            return cloned;
        }
    });

});